<template>
  <div>
    <el-dialog v-model="open" :close-on-click-modal="false" :title="title" append-to-body width="55%"
               @closed="cancel">
      <div class="checkbox-div">
        <el-checkbox-group v-model="checkList">
          <el-checkbox v-for="(item, index) in checkboxList" :key="index" :value="item.id"
                       class="checkbox-item">{{
              item.dictLabel
            }}
          </el-checkbox>
        </el-checkbox-group>
      </div>
      <template #footer>
                <span class="dialog-footer">
                    <span v-if="checkboxList.length > 0" style="margin-right: 10px">共 {{
                        checkboxList.length
                      }} 个待选项</span>
                    <el-button :type="allOrCancelType ? 'info' : 'success'" @click="allOrCancel">
                        {{ allOrCancelType ? '取消全选' : '全选' }}
                    </el-button>
                    <el-button type="primary" @click="submitForm">确 定</el-button>
                    <el-button @click="cancel">取 消</el-button>
                </span>
      </template>
    </el-dialog>
  </div>
</template>

<script lang="ts" setup>
import {listNotExistBaseData} from '@/api/system/sysOrgDict.ts'
import {useUserStoreHook} from "@/store/modules/user"

const useUserStore = useUserStoreHook();
const emits = defineEmits(['refreshParentList', 'submitForm'])
// 登录用户信息
const userInfo = <UserInfoBusi>useUserStore.user.userInfo
const title = ref('字典插入')
const open = ref(false)
const dictType = ref('')
const dictName = ref('')
const isType = ref('')
// 待选字典checkbox
const checkboxList = ref<any>([])
// 已选字典list
const checkList = ref([])
// 全选/取消 按钮状态
const allOrCancelType = ref(false)
const orgId = ref(userInfo.orgId)

/** 显示对话框 */
function showDictInsertDialog(obj) {
  open.value = true
  title.value = obj.title
  dictType.value = obj.dictType
  dictName.value = obj.dictName
  orgId.value = obj.orgId
  isType.value = obj.isType
  listNotExistBaseDataFun()
}

/** 根据orgId、type获取未插入字典 */
function listNotExistBaseDataFun() {
  let params = {
    'orgId': orgId.value,
    'dictType': dictType.value,
    'isType': isType.value
  }
  listNotExistBaseData(params).then((res: any) => {
    checkboxList.value = res.data
  })
}

/** 取消按钮 */
function cancel() {
  open.value = false;
  allOrCancelType.value = false
  checkboxList.value = []
  checkList.value = []
}

/** 保存 */
function submitForm() {
  let data = {
    'checkList': checkList.value,
    'orgId': orgId.value,
    'dictName': dictName.value
  }
  cancel()
  emits("submitForm", data)


}

/** 待选途径全选/取消 */
function allOrCancel() {
  if (allOrCancelType.value) {
    checkList.value = []
    allOrCancelType.value = false
  } else {
    let checkArray = []
    checkboxList.value.forEach(e => {
      checkArray.push(e.id)
    })
    checkList.value = checkArray
    allOrCancelType.value = true
  }
}

defineExpose({
  showDictInsertDialog
})
</script>
<script lang="ts">
export default {
  name: 'DictInsertDialog'
}
</script>
<style scoped></style>
